//# sourceURL=http://uMapApp/UI/Panel/PanelBlock/PropertiesBlock
define([
    "mhjs/mhjs",
    "./PanelBlock",
    "../Item/ListItem"
], function (
    mhjs,
    PanelBlock,
    ListItem
) {

    function PropertiesBlock(option) {

        var _this = this;
        _this.isOpened = false;

        _this._list = [];

        PanelBlock.call(_this, option);
        _this.addClass("propertiesBlock");

    }

    var _class = PropertiesBlock;
    mhjs.Inherit(_class, PanelBlock);


    Object.defineProperties(_class.prototype, {
        "properties"   : {
            set : function (properties) {
                var _this = this;
                _this._properties = properties;

                // var table = $("<table></table>");

                _this.ui.wrap.empty();
                // _this.ui.wrap.append();

                if (_this.map) {

                    var propertiesTree = _this.map.format(_this._properties);

                    // "基础信息"：{
                    //     "编号": "0002",
                    //     "名称": "G50沪渝苏沪界",
                    //     "桩号": "K61+860"
                    // }

                    $.each(propertiesTree, function (label, value) {
                        _this.ui.wrap.append(_this.renderTree(label, value));
                    });

                    // _this.map.sortFormat(
                    //     _this._properties,
                    //     function (key, value) {
                    //         table.append($("<tr class='catlog'><td colspan='2'>" + key + "</td></tr>"));
                    //     },
                    //     function (key, value) {
                    //         table.append($("<tr class='item'><th>" + key + "</th><td>" + (value !== undefined ? value : "") + "</td></tr>"));
                    //     }
                    // );

                    // } else {
                    //
                    //     $.each(_this._properties, function (key, value) {
                    //         table.append($("<tr class='item'><th>" + key + "</th><td>" + (value !== undefined ? value : "") + "</td></tr>"));
                    //     });
                    //
                    //     $.each(_this._properties, function (key, value) {
                    //         table.append($("<tr class='item'><th>" + key + "</th><td>" + (value !== undefined ? value : "") + "</td></tr>"));
                    //     });

                }


            },
            get : function () {
                return this._properties;
            }
        },
        "renderTree"   : {
            value : function (label, value) {

                var _this = this;
                var result;

                if (typeof value !== "object" || value === undefined) {
                    result = _this.renderItem(label, value);
                } else {
                    result = _this.renderFolder(label);

                    $.each(value, function (childLabel, childValue) {
                        result.child.append(_this.renderTree(childLabel, childValue));
                    });
                }

                return result;

            }
        },
        "renderFolder" : {
            value : function (label) {

                var folder = new mhjs.Div({"class" : "folder"});
                folder.label = new mhjs.Div({"class" : "label"});
                folder.label.text(label);
                folder.child = new mhjs.Div({"class" : "child"});

                folder
                    .append(folder.label)
                    .append(folder.child)
                ;
                return folder;
            }
        },
        "renderItem"   : {
            value : function (label, value) {

                var item = new mhjs.Div({"class" : "item"});
                item.label = new mhjs.Div({"class" : "label"});
                item.label.text(label);
                item.valuetext = new mhjs.Div({"class" : "value"});
                item.valuetext.text(value);

                item
                    .append(item.label)
                    .append(item.valuetext)
                ;
                return item;
            }
        },
        "map"          : {
            set : function (map) {
                var _this = this;
                _this._map = new mhjs.Map(map);
            },
            get : function () {
                return this._map;
            }
        }
    });

    return _class;

});